<template>
    <div>
      <deteil-banner></deteil-banner>
      <deteil-header></deteil-header>
      <div class="deteil">
        <deteil-list :list="list"></deteil-list>
      </div>
    </div>
</template>

<script>
  import DeteilBanner from '@/pages/Deteil/components/banner'
  import DeteilHeader from '@/pages/Deteil/components/Heared'
  import DeteilList from '@/pages/Deteil/components/List'
  import axios from 'axios'
    export default {
        name: "Deteil",
        components:{
          DeteilBanner,
          DeteilHeader,
          DeteilList
        },
        data(){
          return{
            list:[]
            // list: [{
            //   "title": "成人票",
            //   "children": [{
            //     "title": "成人三馆联票"
            //   }]
            // }, {
            //   "title": "学生票",
            //   "children": [{
            //     "title": "学社三馆联票"
            //   }]
            // }, {
            //   "title": "儿童票"
            // }, {
            //   "title": "特惠票"
            // }]
          }
        },
      methods:{
          getDeteilInfo(){
              axios.get('/static/makce/detail.json',{
                params:{//拼接id名
                    id:this.$route.params.id
                }
              }).then(this.getSucc)
          },
          getSucc(res){
              // console.log(res)
              res=res.data
              if(res.ret &&res.data){
                  const data = res.data
                  this.list = data.categoryList
              }
          }

      },
      mounted(){
          this.getDeteilInfo()
      }
    }
</script>

<style scoped lang="stylus">
    .deteil{
       height :10rem;
    }
</style>
